<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>javascript</title>
    <style>
        /* 行内样式 */
        /* 页面样式 */
        /* 外部样式 */
    </style>
    <script>
        // 简介、变量、数据类型、流程控制语句、函数、DOM 
        // alert('hello');
        // 声明变量
        // 特点：动态类型，弱类型
        // 动态类型：变量在声明时不需要指定类型，
        // 弱类型：变量在运行时可以改变类型，但是在某一时刻只能有一种类型
        var a = 10;
        var str = 'hello';
        a = 100;
        console.log(typeof a);
        a = 'hello';
        console.log(typeof a);
        a = true;
        console.log(typeof a);
        // 输出到页面(document文档对象)
        // document.write('<img src="imgs/banner-1.jpg" alt="图片">');
        // 注释语句：ctrl+/
        
        // 数据类型：
        // 基本(原始)数据类型：number、string、boolean、undefined(未定义)、null(空对象)
        // 引用数据类型：object
        var id='2024012123';
        // console.log(id/100);
        // console.log(id.log);
        // console.log(typeof id);
        document.write(id);
        console.log(typeof id);
        if(id=='2024012123'){
            document.write('加分');
        }
        // 比较运算符：==、===、!=、!==、>、<、>=、<=
        // ==：只比较值，不比较类型
        // ===：既比较值，又比较类型
        // !=：只比较值，不比较类型
        // !==：既比较值，又比较类型
        // console.log(0=='0');
        // console.log(0==='0');
        // console.log(0==false);
        // console.log(0===false);
        // 字符串拼接：+，加号两边只要有一个是字符串，就进行字符串拼接
        var str1 = 'hello';
        var str2 = 1;
        var str3 = 2;
        console.log('hello'+str2+'world')
        console.log(str2+str3+str1+1+2);
        var url = 'imgs/banner-1.jpg';
        console.log('<img src="'+url+'" alt="图片">');
        document.write(`
            <h1>插入图片</h1>
            <img 
                style='width: 100px' 
                src="${url}" 
                alt='${str1}' 
            >
        `);
        if(id==2024012123){
            document.write('加分');
        }
        if(id==2024012123){
            document.write('加分');
        }else{
            document.write('不加分');
        }
        document.write('<table border="1">');
        for(var i = 0; i < 4; i++) {
            document.write('<tr>');
            for(var j = 0; j < 4; j++) {
                document.write(`<td>Row ${i+1}, Col ${j+1}</td>`);
            }
            document.write('</tr>');
        }
        document.write('</table>');
    </script>
    <script src="js/js.js"></script>
    <script src="js/js.js"></script>
</head>
<body>
    <h1>JavaScript</h1>
    <p>JavaScript 是一种脚本语言，是一种解释型语言，是一种动态类型，弱类型语言</p>
    <table>
        <tr>
            <td>1</td>
            <td>2</td>
            <td>3</td>
            <td>4</td>
        </tr>
        <tr>
            <td>1</td>
            <td>2</td>
            <td>3</td>
            <td>4</td>
        </tr>
    </table>
</body>
</html>